<%@page import="com.surelution.projects.crm.Market"%>
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="layout" content="main"/>
<g:set var="entityName" value="${message(code: 'market.label', default: 'Market')}" />
<g:javascript library="jquery"/>
<resource:dateChooser />
<link rel="stylesheet" href="${resource(dir:'css',file:'defaultTheme.css')}" />
<script type="text/javascript" src="${resource(dir:'js/jquery',file:'jquery.fixedheadertable.min.js')}"></script>
<script type="text/javascript" src="${resource(dir:'js/jquery',file:'jquery.printElement.min.js')}"></script>
<script type="text/javascript" src="${resource(dir:'js/datechooser',file:'datechooser.js')}"></script>
<title>${message(code: 'market.station.sum.label', default: 'station.sum')}</title>
	<script type="text/javascript">
		$(document).ready(function() {
		   $("#simplePrint").click(function() {
		       printElem({leaveOpen: true, printMode: 'popup', overrideElementCSS: ["${resource(dir:'plugins/richui-0.8/css',file:'calendarmonthview.css')}","${resource(dir:'css',file:'main.css')}"]});
		   });
		   $('#myTable01').fixedHeaderTable({ footer: false, cloneHeadToFoot: false, autoShow: true });
		});
		function printElem(options){
		    $('#monthReport').printElement(options);
		};

	</script>
</head>

<body>
  <div class="body">
          <div class="nav">
            <span class="menuButton"><a class="home" href="${createLink(uri: '/')}"><g:message code="default.home.label"/></a></span>
          </div>
          <div>
			<g:if test="${flash.message}">
            	<div class="message">${flash.message}</div>
            </g:if>
            <p style="font-size:16px;color:#000;margin:10px 0;">${message(code: 'market.station.sum.label', default: 'station.sum')}</p>
        	<g:form action="stationSumReport">
        		选择月份： <g:datePicker name="month" precision="month" value="${month}" />
        		<span class="menuButton" style="margin-right:5px;"><g:actionSubmit value="${message(code: 'default.button.search.label', default: '查询')}" action="stationSumReport"/></span>
        		<span class="menuButton"><g:actionSubmit value="${message(code: 'default.button.export.label', default: 'Export')}" action="stationSumReportExport"/></span>
			    <input type="button" value="打印报表" id="simplePrint" /><br>
    		</g:form>
        </div>
        <%
			def tgasSale=0,tdieselSale=0,tnewGasSale=0,tnewDieselSale=0,tcardHolderMarketCount=0,tnewMarketCount=0,tnewMarketTotalCount=0,tcashMarketCount=0
		 %>
        
        <div id="monthReport" style="height:630px;">
			<label style="font-size:16px;color:#0f3072;">报表日期：  ${startDay.format("yyyy年MM月dd日")}到${endDay.format("yyyy年MM月dd日")}</label>
       		<table id="myTable01">
       			<thead>
        		<tr>
        			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;width:50px;">片区</td>
        			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;width:100px;">加油站</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">固定客户销量（汽油）</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">固定客户销量（柴油）</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">新增客户销量（汽油）</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">新增客户销量（柴油）</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">固定客户总数</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">新增客户数</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">潜在客户总数</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">潜在客户转化率(%)</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">现金客户总数</td>
          			<td style="text-align: center;vertical-align: middle;background:#75746a;color:#fff;">现金客户转换率(%)</td>
    			</tr>
    			<tr class="even">
   					<td style="text-align:center;">合计</td>
   					<td style="text-align:center;"></td>
   					<td style="text-align:center;"><div id="tgasSale"></div></td>
   					<td style="text-align:center;"><div id="tdieselSale"></div></td>
   					<td style="text-align:center;"><div id="tnewGasSale"></div></td>
   					<td style="text-align:center;"><div id="tnewDieselSale"></div></td>
   					<td style="text-align:center;"><div id="tcardHolderMarketCount"></div></td>
   					<td style="text-align:center;"><div id="tnewMarketCount"></div></td>
   					<td style="text-align:center;"><div id="tnewMarketTotalCount"></div></td>
   					<td style="text-align:center;">0</td>
   					<td style="text-align:center;"><div id="tcashMarketCount"></div></td>
   					<td style="text-align:center;">0</td>
   				</tr>
   				</thead>
    			<tbody>
   				<g:each in="${stationList}" var="r" status="i">
   				<%
					tgasSale += r.gasSale
					tdieselSale += r.dieselSale
					tnewGasSale += r.newGasSale
					tnewDieselSale += r.newDieselSale
					tcardHolderMarketCount += r.cardHolderMarketCount
					tnewMarketCount += r.newMarketCount
					tnewMarketTotalCount += r.newMarketTotalCount
					tcashMarketCount += r.cashMarketCount
				 %>
				<tr class="${(i % 2) == 0 ? 'odd' : 'even'}">
   					<td style="text-align:center;">${r.stationArea?.areaName}</td>
   					<td style="text-align:center;">${r.shortName}</td>
   					<td style="text-align:center;">${formatNumber(number:r.gasSale,maxFractionDigits:1) }</td>
   					<td style="text-align:center;">${formatNumber(number:r.dieselSale,maxFractionDigits:1) }</td>
   					<td style="text-align:center;">${formatNumber(number:r.newGasSale,maxFractionDigits:1)  }</td>
   					<td style="text-align:center;">${formatNumber(number:r.newDieselSale,maxFractionDigits:1) }</td>
   					<td style="text-align:center;">${r.cardHolderMarketCount }</td>
   					<td style="text-align:center;">${r.newMarketCount }</td>
   					<td style="text-align:center;">${r.newMarketTotalCount }</td>
   					<td style="text-align:center;">${(formatNumber(number:r.newToCardRatio,maxFractionDigits:1)) }</td>
   					<td style="text-align:center;">${r.cashMarketCount }</td>
   					<td style="text-align:center;">${r.cashToCardRatio}</td>
   				</tr>
   				</g:each>
   				</tbody>
         	</table>
        </div>
		<script type="text/javascript">
			document.getElementById("tgasSale").innerHTML = '${(formatNumber(number:tgasSale,maxFractionDigits:1)) }';
			document.getElementById("tdieselSale").innerHTML = '${(formatNumber(number:tdieselSale,maxFractionDigits:1)) }';
			document.getElementById("tnewGasSale").innerHTML = '${(formatNumber(number:tnewGasSale,maxFractionDigits:1)) }';
			document.getElementById("tnewDieselSale").innerHTML = '${(formatNumber(number:tnewDieselSale,maxFractionDigits:1)) }';
			document.getElementById("tcardHolderMarketCount").innerHTML = '${tcardHolderMarketCount}';
			document.getElementById("tnewMarketCount").innerHTML = '${tnewMarketCount}';
			document.getElementById("tnewMarketTotalCount").innerHTML = '${tnewMarketTotalCount}';
			document.getElementById("tcashMarketCount").innerHTML = '${tcashMarketCount}';
        </script>
  </div>
</body>
</html>